<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>

    <script >
        const DOM = new Proxy({}, {
            get(target, property) {
                return function(attr = {}, ...children) {
                    const el = document.createElement(property)
                    for(let key of Object.keys(attr)) {
                        el.setAttribute(key, attr[key])
                    }
                    for(let child of children) {
                        if(typeof child == 'string') {
                            child = document.createTextNode(child)
                        }
                        el.appendChild(child)
                    }
                    return el
                }
            }
        })

        let oDiv = DOM.div({id: 'div1', class: 'aaa'}, 'aaaa', 'ccc', DOM.a({id: 'a1', href: 'www.baidu.com'}, 'aaaa'))
        console.log(oDiv)

        const obj = new Proxy({}, {
            set (target, prop, value) { //set deleteProperty get has  apply(拦截方法)
                if(prop === 'age') {
                    if(!Number.isInteger(value)) {
                        throw new TypeError('必须是整数')
                    }
                    if(value > 200) {
                        throw new RangeError('超标了')
                    }
                }
                target[prop] = value;
            }
        })
        console.log(obj.age = 10)

        function sum(a, b) {
            return a + b
        }

let newSum = new Proxy(sum, {
            apply(target, context, args) { //context 是this 指向
                console.log(...arguments)
                return Reflect.apply(...arguments) ** 2;//** 平方的意思
            }
})

console.log(newSum(1, 2))

let v = Reflect.apply(Math.ceil, null, [9.9])
console.log(v)
    </script>
</body>
</html>